<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="120px"
    >
<!--      <el-form-item label="业务businessId" prop="businessKey">-->
<!--        <el-input-->
<!--          v-model="queryParams.businessKey"-->
<!--          placeholder="请输入业务businessId"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
      <el-form-item label="业务类型" prop="businessType">
        <el-select v-model="queryParams.businessType" placeholder="请选择业务类型" clearable>
          <el-option
            v-for="dict in dict.type.process_define_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="任务名称" prop="businessTitle">
        <el-input
          v-model="queryParams.businessTitle"
          placeholder="请输入任务名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="申请人" prop="applyUser">
        <el-input
          v-model="queryParams.applyUser"
          placeholder="请输入申请人"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="状态" prop="processStatus">
        <el-select v-model="queryParams.processStatus" placeholder="请选择状态" clearable>
          <el-option
            v-for="dict in dict.type.process_business_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-table v-loading="loading" :data="infoRunTaskDataList">
      <el-table-column label="序号" align="center" type="index" width="50"/>
      <el-table-column label="业务模块" align="center" prop="businessType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.process_define_type" :value="scope.row.businessType"/>
        </template>
      </el-table-column>
      <el-table-column label="任务名称" align="center" prop="businessTitle" />
      <el-table-column label="当前任务节点" align="center" prop="taskName" />
      <el-table-column label="申请人" align="center" prop="applyUser" />
      <el-table-column label="发起申请时间" align="center" prop="applyTime" />
      <el-table-column label="任务创建时间" align="center" prop="createTaskTime" />
      <el-table-column label="状态" align="center" prop="processStatus">
        <template slot-scope="scope">
            <el-button
              type="text"
              @click="handleJinDu(scope.row)"
            >
              <el-link type="primary">
                <dict-tag :options="dict.type.process_business_status" :value="scope.row.processStatus"/>
              </el-link>
            </el-button>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleTask(scope.row)">办理</el-button>

          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="guiHuanTask(scope.row)"
            v-if="scope.row.claimTime"
          >归还任务</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 查看流程状态 -->
    <JinDu ref="picture"/>

    <!--  请假  -->
    <qing-jia-dialog ref="qingJiaDialog" @ok="getList"></qing-jia-dialog>

    <!--  试验报告-电气-莫莫克  -->
    <MmkDqSq ref="mmkDqSq" @ok="getList"/>

    <!--  试验报告-电气-龙溪口  -->
    <LxkDqSq ref="lxkDqSq" @ok="getList"/>

    <!--  试验报告-电气-沙坪一级  -->
    <SpyjDqSq ref="spyjDqSq" @ok="getList"/>

    <!--  试验报告-电气-硬梁包  -->
    <YlbDqSq ref="ylbDqSq" @ok="getList"/>

    <!--  试验报告-电气-巴拉  -->
    <BlDqSq ref="blDqSq" @ok="getList"/>

    <!--  试验报告-无损-沙坪一级  -->
    <SpYjWsSq ref="spYjWsSq" @ok="getList"/>

    <!--  试验报告-无损-硬梁包  -->
    <YlbWsSq ref="ylbWsSq" @ok="getList"/>

    <!--  试验报告-无损-巴拉  -->
    <BlWsSq ref="blWsSq" @ok="getList"/>

    <!--  试验报告-无损-绰斯甲  -->
    <CsjWsSq ref="csjWsSq" @ok="getList"/>

    <!--  试验报告-无损-衢江  -->
    <QjWsSq ref="qjWsSq" @ok="getList"/>

    <!--  试验报告-无损-天台  -->
    <TtWsSq ref="ttWsSq" @ok="getList"/>

    <!--  物资管理-物资申请  -->
    <WzSq ref="wzSq" @ok="getList"/>

    <!--  采购计划申请  -->
    <CgJhSq ref="cgJhSq" @ok="getList"/>

    <!--  六号线需求计划申请  -->
    <LhxXqJhSq ref="lhxXqJhSq" @ok="getList"/>

    <!--  六号线采购计划申请  -->
    <LhxCgJhSq ref="lhxCgJhSq" @ok="getList"/>

  </div>
</template>

<script>
import { selectMyTask, unClaimTask } from "@/api/activiti/task.js";

import QingJiaDialog from "@/views/infoQingJia/components/qingJia.vue";
import JinDu from "@/views/components/liuChengState/jindu";
import MmkDqSq from "@/views/jsgk/gczl/sybg/mmkdq/MmkDqSq";
import LxkDqSq from "@/views/jsgk/gczl/sybg/lxkdq/LxkDqSq";
import SpyjDqSq from "@/views/jsgk/gczl/sybg/spyjdq/SpyjDqSq";
import YlbDqSq from "@/views/jsgk/gczl/sybg/ylbdq/YlbDqSq";
import BlDqSq from "@/views/jsgk/gczl/sybg/bldq/BlDqSq";
import SpYjWsSq from "@/views/jsgk/gczl/sybg/spyjws/SpYjWsSq";
import YlbWsSq from "@/views/jsgk/gczl/sybg/ylbws/YlbWsSq";
import BlWsSq from "@/views/jsgk/gczl/sybg/blws/BlWsSq";
import CsjWsSq from "@/views/jsgk/gczl/sybg/csjws/CsjWsSq";
import QjWsSq from "@/views/jsgk/gczl/sybg/qjws/QjWsSq";
import TtWsSq from "@/views/jsgk/gczl/sybg/ttws/TtWsSq";
import WzSq from "@/views/wzgl/wzsq/components/WzSq.vue";
import CgJhSq from "@/views/wzgl/cgjh/components/CgJhSq.vue";
import LhxXqJhSq from "@/views/xqjh/lhxxqjh/components/LhxXqJhSq.vue";
import LhxCgJhSq from "@/views/xqjh/lhxcgjh/components/LhxCgJhSq.vue";

export default {
  name: "InfoRunTaskData",
  dicts: ['process_business_status', 'process_define_type'],
  components: {
    LhxCgJhSq,
    LhxXqJhSq,
    CgJhSq,
    WzSq,
    TtWsSq,
    QjWsSq,
    CsjWsSq,
    BlWsSq,
    YlbWsSq,
    SpYjWsSq,
    BlDqSq,
    YlbDqSq,
    SpyjDqSq,
    LxkDqSq,
    MmkDqSq,
    QingJiaDialog,
    JinDu
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 正在运行任务的业务数据表格数据
      infoRunTaskDataList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        businessType: this.$route.query.businessType,
        businessTitle: null,
        applyUser: null,
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    //查询进度
    handleJinDu(row) {
      this.$refs.picture.handleOpen(row);
    },
    /** 查询正在运行任务的业务数据列表 */
    getList() {
      this.loading = true;
      selectMyTask(this.queryParams).then(response => {
        this.infoRunTaskDataList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    //办理任务
    handleTask(row) {
      //根据类型弹出不同的弹窗
      console.log(row, "====");
      switch (row.businessType) {
        case '1': // 如果是请假类型
          this.$refs.qingJiaDialog.handleOpen(row); // 调用请假弹窗
          break;
        case '2': // 如果是试验报告-电气-莫莫克
          this.$refs.mmkDqSq.handleOpen(row); // 调用 试验报告-电气-莫莫克 申请弹窗
          break;
        case '3': // 如果是试验报告-电气-龙溪口
          this.$refs.lxkDqSq.handleOpen(row); // 调用 试验报告-电气-龙溪口 申请弹窗
          break;
        case '4': // 如果是试验报告-电气-沙坪一级
          this.$refs.spyjDqSq.handleOpen(row); // 调用 试验报告-电气-沙坪一级 申请弹窗
          break;
        case '5': // 如果是试验报告-电气-硬梁包
          this.$refs.ylbDqSq.handleOpen(row); // 调用 试验报告-电气-硬梁包 申请弹窗
          break;
        case '6': // 如果是试验报告-电气-巴拉
          this.$refs.blDqSq.handleOpen(row); // 调用 试验报告-电气-巴拉 申请弹窗
          break;
        case '7': // 如果是试验报告-无损-沙坪一级
          this.$refs.spYjWsSq.handleOpen(row); // 调用 试验报告-无损-巴拉 申请弹窗
          break;
        case '8': // 如果是试验报告-无损-硬梁包
          this.$refs.ylbWsSq.handleOpen(row); // 调用 试验报告-无损-硬梁包 申请弹窗
          break;
        case '9': // 如果是试验报告-无损-巴拉
          this.$refs.blWsSq.handleOpen(row); // 调用 试验报告-无损-巴拉 申请弹窗
          break;
        case '10': // 如果是试验报告-无损-绰斯甲
          this.$refs.csjWsSq.handleOpen(row); // 调用 试验报告-无损-绰斯甲 申请弹窗
          break;
        case '11': // 如果是试验报告-无损-衢江
          this.$refs.qjWsSq.handleOpen(row); // 调用 试验报告-无损-衢江 申请弹窗
          break;
        case '12': // 如果是试验报告-无损-天台
          this.$refs.ttWsSq.handleOpen(row); // 调用 试验报告-无损-天台 申请弹窗
          break;
        case '13': // 如果是物资管理--物资申请
          this.$refs.wzSq.handleOpen(row); // 调用 物资管理--物资申请 申请弹窗
          break;
        case '14': // 如果是采购计划申请
          this.$refs.cgJhSq.handleOpen(row); // 调用 采购计划申请 申请弹窗
          break;
        case '15': // 如果是6号线需求计划计划申请
          this.$refs.lhxXqJhSq.handleOpen(row); // 调用 需求计划申请 申请弹窗
          break;
        case '16': // 如果是6号线采购计划计划申请
          this.$refs.lhxXqJhSq.handleOpen(row); // 调用 采购计划申请 申请弹窗
          break;
        // 更多类型的处理...
        default:
          this.$message.error('未定义的类型');
      }
    },
    //归还任务
    guiHuanTask(row) {
      unClaimTask(row.taskId).then(res => {
        this.$message.success("归还成功");
        this.getList();
      });
    }
  }
};
</script>
